import React        from 'react';
import { Link }     from 'react-router-dom';
// 组件
import PageTitle    from '../../common/pageTitle';
// util
import eventBus     from '../../util/eventBus.js';
import _mm          from '../../util/Mutil.js';
// service
import _statistic   from '../../service/statisticService.js';

import './index.scss'

class Home extends React.Component {
  constructor(props){
    super(props);
    this.state = {
      collapse        : true,
      userCount       : '-',
      productCount    : '-',
      orderCount      : '-'
    }
  }
  render () {
    return (
      <div>
        <PageTitle title="首页" />
        <div className="row">
          <div className="col-md-4">
            <Link to="/user" className="color-box brown">
              <p className="count">{this.state.userCount}</p>
              <p className="desc">
                <i className="fa fa-user-o"></i>
                <span>用户总数</span>
              </p>
            </Link>
          </div>
          <div className="col-md-4">
            <Link to="/product" className="color-box green">
              <p className="count">{this.state.productCount}</p>
              <p className="desc">
                <i className="fa fa-list"></i>
                <span>商品总数</span>
              </p>
            </Link>
          </div>
          <div className="col-md-4">
            <Link to="/order" className="color-box blue">
              <p className="count">{this.state.orderCount}</p>
              <p className="desc">
                <i className="fa fa-check-square-o"></i>
                <span>订单总数</span>
              </p>
            </Link>
          </div>
        </div>
      </div>
    )
  }
  componentDidMount () {
    this.loadCount()
  }
  // 获取count数据
  loadCount () {
    _statistic.getHomeCount().then(res => {
      this.setState(res)
    }, err => {
      _mm.errorTips(err)
    })
  }
}

export default Home